<template>
	<view>
		<view class="list" v-for="(item,index) in list.slice(0,idxLen)" :key=index >
			<view>
				<text>用户需求：<text>{{item.xq}}</text></text>
				
			</view>
			<h3>楼盘匹配推荐</h3>
			<view>
				<text>推荐楼盘：</text>
				<text>{{item.tjlp}}</text>
			</view>
			<view>
				<text>推荐理由：</text>
				<text>{{item.reson}}</text>
			</view>
			<view>
				<text>推荐指数</text>
				<text>{{item.tjzs}}</text>
			</view>
		</view>
		<view class="serve" @click="getMore">展开更多服务列表</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				idxLen: 1,
				list: [{
						"xq": '已有购房资格已有购房资格已有购房资格已有购房资格111',
						'tjlp': 'xxxxxx楼盘111',
						'reson': '楼盘好好好111',
						'tjzs': '☆☆☆☆☆'
					},
					{
						"xq": '已有购房资格已有购房资格已有购房资格已有购房资格222',
						'tjlp': 'xxxxxx楼盘222',
						'reson': '楼盘好好好222',
						'tjzs': '☆☆☆☆☆'
					},
					{
						"xq": '已有购房资格已有购房资格已有购房资格已有购房资格222',
						'tjlp': 'xxxxxx楼盘222',
						'reson': '楼盘好好好222',
						'tjzs': '☆☆☆☆☆'
					}
				]
			}
		},
		created() {

		},
		methods: {
			getMore() {
				//list数据长度为请求过来的数据长度
				if (this.idxLen == this.list.length) {
					uni.showToast({
					    icon: 'none',
					    title: '没有更多了'
					});
				} else {
					this.idxLen = this.list.length
				}

			}
		}
	}
</script>

<style lang="scss">
	.list {
		margin-bottom: 30rpx;
		padding: 0 20rpx;
	}

	.serve {
		text-align: center;
		background-color: #eee;
		// height: 80rpx;
		line-height: 80rpx;
	}
</style>
